<template>
  <div class="optionLog-component">
    <div class="title-container">
      <div class="left">
        <p class="title-con"><span>操作日志</span></p>
      </div>
    </div>
    <ul class="log-ul">
      <li class="log-li" v-for="(item,index) in logData" :key="index">
        <div class="pic-container">
          <el-image class="pic" :src="item.image">
            <div slot="error" class="image-slot"
              style="width:100%;height:100%;display:flex;justify-content:center;align-items:center;">
              <i class="el-icon-user-solid" style="font-size:24px;color:#666;"></i>
            </div>
          </el-image>
        </div>
        <div class="log-container">
          <div class="user-info-container">
            <div class="user-info">
              <span>{{item.user_name}}（{{item.department_name}}）</span>
              <span
                style="padding-left:20px">{{dateFormat1('yyyy-mm-dd HH:MM:SS',item.operation_time)}}</span>
            </div>
            <!-- <div class="time">{{item.department_name}}</div> -->
            <div class="box">{{item.operation_content}}</div>
            <div v-if="item.data"  style="margin-left:20px">
              <el-button type="text" @click="handlTo(JSON.parse(item.data).id)">{{JSON.parse(item.data).destroy_no}}</el-button>
              </div>
          </div>
        </div>
      </li>
    </ul>
    <!--页码-->
    <pagination style="display:flex;justify-content:flex-end;" :total="total"
      :page.sync="list.pager.skip" :limit.sync="list.pager.limit" @pagination="pagination" />
  </div>
</template>

<script>
import { history } from "@/api/sampleManagement";
export default {
  data() {
    return {
      total: 0,
      logData: [],
      list: {
        id: "",
        pager: {
          limit: 10,
          skip: 1
        }
      },
      total: 0
    };
  },
  //生命周期 - 创建完成（访问当前this实例）
  created() {
    this.historyData();
  },
  methods: {
    //获取列表数据
    historyData() {
      this.list.id = this.$route.query.id;
      history(this.list).then(res => {
        if (res.code === 200) {
          this.logData = res.data.data || [];
          this.total = res.data.total;
        }
      });
    },

    pagination(val) {
      this.list.limit = val.limit
       this.list.skip =  val.page
       this.historyData();
    },
    handlTo(id){
      this.$router.push({
          path: '/sampleManagement/destruction/apply',
          query: { id: id }
        })
    }
  }
};
</script>
<style lang="scss" scoped>
/* @import url(); 引入css类 */
@import "@/assets/scss/views/sampleInspection/log.scss";
::v-deep .pagination-container{
  padding: 0!important;
}
</style>